<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>

        // document.cookie = 'tt=123' ;

        // document.cookie = 'usetTel=188' ;

        // document.cookie = 'color=red' ;


        // 在许多杂乱的数据找到需要的
        //    把我们真正需要的数据加上记号   YYDS_yy    YYDS_aa     YYDS_qq


        document.cookie = 'YYDS_yy=123' ;
        document.cookie = 'YYDS_qq=999' ;
        document.cookie = 'YYDS_aa=222' ;


        let cookies = document.cookie ;
        let arr = cookies.split('; ') ;
        arr = arr.map( v => {

            return {
                name : v.split('=')[0] ,
                content : v.split('=')[1]
            }
        })

        console.log(arr);


        // 过滤数据  找到  YYDS_
        arr = arr.filter( v => v.name.includes('YYDS_')) ;
        console.log(arr);


        // 显示数据的时候  要把YYDS_  去掉    替换

        let html = '' ;
        arr.forEach( (v , i) => {
            const {name , content} = v ;
            html += `
            <li>
                <span>${i + 1}</span>
                <span>${name.replace('YYDS_' , '')}</span>
                <span>${content}</span>
            </li>
            `
        })

        console.log(html);


    </script>


</body>
</html>